<div class="main-title">
	<fly:variable name="page_title" />
</div>
<fly:block name="district">
<div id="content_body" class="content_body<fly:variable name="page_class" />">
<fly:include name="pagination_search_up" />
		<table class="location-liste tablesorter">
			<thead>
				<tr>
					<td width="440" title="title location"><div class="header general" id="name_place"><fly:variable name="text_location" /></div><span id="name_place_l" class="loading"></span></td>
					<td width="100" title="Price sell"><div class="header general" id="price_sell"><fly:variable name="text_price_sell" /></div><span id="price_sell_l" class="loading"></span></td>
					<td width="100" title="Price rental"><div class="header general" id="price_rental"><fly:variable name="text_price_rental" /></div><span id="price_rental_l" class="loading"></span></td>
					<td title="type of location"><div class="header general" id="estate_tile"><fly:variable name="text_type" /></div><span id="estate_tile_l" class="loading"></span></td>
				<tr>
			</thead>
			<tbody id="item_list">
		<fly:list name="list_category_map">	
			<tr onclick="document.location='<fly:variable name='url_category_map' />'" title="<fly:variable name='meta_title' />"
		       	onmouseover="$(this).addClass('over');"
		        onmouseout="$(this).removeClass('over');" >
				<td>   		
			   		<div class="place_width">
			   		   <fly:block name="block_place_photo">
			   				<div class="location_photo">
			   					<fly:list name="location_photo">
				   					<a rel="/<fly:variable name='image_preview' />" href="<fly:variable name='url_photo' />" class="preview"><img src="/<fly:variable name="src_photo" />" width="<fly:variable name="width" />" height="<fly:variable name="height" />" /></a>
				   				</fly:list>
			   				</div>
			   			</fly:block>
			   				<div title="<fly:variable name='meta_title' />" class="title_location">
						   		<fly:variable name="place_name" />
						   		<input type="hidden" value='<fly:variable name="map_address" />' id="addr_<fly:variable name="id_addr" />" name="addr" class="addr" />
			   					<div class="block_title">
						   			<fly:variable name="place_description"/>
		   						</div>
			   				</div>
				   </div>
		   		</td>
		   		<td><span class="prix"><fly:variable name="price_sell" /></span></td>
				<td><span class="prix"><fly:variable name="price_rental" /></span></td>
				<td title="<fly:variable name='type_meta_title' />"><fly:variable name="real_estate" /></td>
			</tr>    		
		</fly:list>
		</tbody>
	</table>
<fly:include name="pagination_search_down" />
<div id="map_canvas"></div>

<fly:block name="list_place">
	<div id="list_place">
		<h1><fly:variable name="title_rented_sold" /></h1>
			<table class="location-liste">
				<thead>
					<tr>
						<td width="480" title="title location"><div class="header_home general" id="name_place"><fly:variable name="text_location" /></div><span id="name_place_l" class="loading"></span></td>
						<td width="90" title="Status"><div class="header_home general" id="status"><fly:variable name="text_status" /></div><span id="status_l" class="loading"></span></td>
						<td title="type of location"><div class="header_home general" id="estate_tile"><fly:variable name="text_type" /></div><span id="estate_tile_l" class="loading"></span></td>
					<tr>
				</thead>
				<tbody id="item_list">
				<fly:list name="list_rented_sold">
				<tr  onclick="document.location='<fly:variable name='url_category_map' />'" title="<fly:variable name='meta_title' />" 	onmouseover="$(this).addClass('over');" onmouseout="$(this).removeClass('over');" >
					<td> 		
				   		<div class="place_width">
				   		   <fly:block name="block_place_photo">
				   				<div class="location_photo">
				   					<fly:list name="location_photo">
					   					<a rel="/<fly:variable name='image_preview' />" href="<fly:variable name='url_photo' />" class="preview"><img src="/<fly:variable name="src_photo" />" width="<fly:variable name="width" />" height="<fly:variable name="height" />" /></a>
					   				</fly:list>
				   				</div>
				   			</fly:block>
			   				<div title="<fly:variable name='meta_title' />" class="title_location">
						   		<fly:variable name="place_name" />
						   		<div class="block_title">
						   			<fly:block name="text_reanted_sold_list">
										<div class="text_reanted_list_sold"><div class="<fly:variable name='text_reanted_sold_list' />"></div></div>
									</fly:block>
							   		<fly:variable name="place_description"/>
			   					</div>
			   				</div>
					   </div>
			   		</td>
					<td><fly:variable name="status" /></td>
					<td title="<fly:variable name='type_meta_title' />"><fly:variable name="real_estate" /></td>
				</tr>  	   		
				</fly:list>	
				</tbody>
			</table>
	</div>		
	</fly:block>
</div>
<script type="text/javascript">
	$(document).ready(function() {		
		initialize();
		GUnload();
		$("#get_address").click(function(){
			
			$("#sms_error").text('');
			var link = $("a.gs-secondary-link").attr('href');
			if(link){
				var lat = calcLat(link);
				var lng = calcLng(link);
				$("#place_name").val($(".gs-localResult a.gs-title").text());
				$("#city").val($(".gs-localResult div.gs-city").text());
				$("#country").val($(".gs-localResult div.gs-country").text());
				$("#address").val($(".gs-localResult div.gs-street").text());
				$("#phone_number").val($(".gs-localResult div.gs-phone").text());
				$("#latitude").val(lat);
				$("#longitude").val(lng);
			}else{
				$("#sms_error").text('Please search address on the map ..!');
			}
			
		});
	});
	var x , y ;
		
	
	 function initialize() {
     if (GBrowserIsCompatible()) {
      
        // Create and Center a Map
        var map = new GMap2(document.getElementById("map_canvas"));
        //map.setCenter(new GLatLng(11.558831,104.91745), 13);
        map.setCenter(new GLatLng(<fly:variable name='latitude_map' />,<fly:variable name='longitude_map' />), <fly:variable name='zome_level' />); 
          
        
        map.addControl(new GLargeMapControl());
        map.addControl(new GMapTypeControl());
        
        <fly:list name="listGoogleMapJavascript">
			var point = new GLatLng(<fly:variable name="latitude" />, <fly:variable name="longitude" />);
			var addr = $("#addr_<fly:variable name='addr' />").val();
	        var html = '<table><tr><fly:block name="map_image"><td valign="top"><div id="hilight-image"><a href="<fly:variable name="url_map" />" title="<fly:variable name="map_meta_title" />"><img src="<fly:variable name="map_photo" />" width="<fly:variable name="map_width" />" height="<fly:variable name="map_height" />" /></a></div></td></fly:block>'+
	        		   '<td valign="top">'+
			           '<fly:block name="map_place_name"><b><a href="<fly:variable name="url_map" />" title="<fly:variable name="map_meta_title" />"><fly:variable name="map_place_name" /></a></b><br /></fly:block>'+
			           '<fly:block name="map_address">'+addr+'<br /></fly:block>'+
			           '<fly:block name="map_province"><fly:variable name="map_province" /><br /></fly:block>'+
		               '</td></tr></table><br />';
		               		  
	        var marker = createMarker(point, html);
	        map.addOverlay(marker);
        </fly:list>
        // bind a search control to the map, suppress result list
        map.addControl(new google.maps.LocalSearch(), new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,20)));
 
        		
      }
    }
 
   GSearch.setOnLoadCallback(initialize);
	function calcLat(url) {
		var latlng = url.match(/\+%40.*&/);
		var lat = latlng.toString().match(/\+%40.*%2C/);
		lat = lat.toString().replace(/\+%40|%2C/gi, '');
		return lat;
	}
	function calcLng(url) {
		var latlng = url.match(/\+%40.*&/);	
		var lng = latlng.toString().match(/%2C.*&/);
		lng = lng.toString().replace(/%2C|&/gi, '');
		return lng;
	}
	function createMarker(point, html) {
      var marker = new GMarker(point, customIcons["default"]);
      GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(html);
      });
      return marker;
    }
    
	var iconBlue = new GIcon(); 
    iconBlue.image = 'http://labs.google.com/ridefinder/images/mm_20_blue.png';
    iconBlue.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
    iconBlue.iconSize = new GSize(12, 20);
    iconBlue.shadowSize = new GSize(22, 20);
    iconBlue.iconAnchor = new GPoint(6, 20);
    iconBlue.infoWindowAnchor = new GPoint(5, 1);

    var iconRed = new GIcon(); 
    iconRed.image = 'http://labs.google.com/ridefinder/images/mm_20_red.png';
    iconRed.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
    iconRed.iconSize = new GSize(12, 20);
    iconRed.shadowSize = new GSize(22, 20);
    iconRed.iconAnchor = new GPoint(6, 20);
    iconRed.infoWindowAnchor = new GPoint(5, 1);

    var customIcons = [];
    customIcons["default"] = iconRed;

</script>
</fly:block>